
<%@include file="/WEB-INF/common/taglibs.jsp"%>
<script type="text/javascript"
	src="${ctx}/resources/js/datatable-query.js"></script>
<div class="row-fluid">
<div class="span12">
<div class="box gradient">
<div class="title">
<h4><span>Post</span></h4>
<a href="#" class="minimize">Minimize</a></div>
<div class="content scrollable clearfix">
<table class="ajaxTable display table table-bordered">
	<thead>
		<tr>
			<th>Title</th>
			<th>Author</th>
			<th>Categories</th>
			<th>Status</th>
			<th>Create Time</th>
			<th>Action</th>
		</tr>
	</thead>
</table>
</div>
</div>

</div>

<shiro:hasPermission name="post:create">
	<a href="${ctx}/post/create/" class="btn btn-info"> <span
		class="icon12 icomoon-icon-plus white"></span> New</a>
</shiro:hasPermission>
</div>



<script type="text/javascript">

var render = false;
var oTime = "";
var oTable;
$(document).ready(function () {
	oTable = $('.ajaxTable').dataTable({
		"bLengthChange": true,
		"aoColumnDefs": [
		  { 'bSortable': false, 'aTargets': [2] }
		],
		"sAjaxSource": '${ctx}/post/',
		"fnInitComplete": function (oSettings, json) { }
	});
	var name = $("<input>").attr({
		type: "text",
		field: "title",
		op: "cn",
		placeholder: "Title",
		class: "filterdata"
	});
	var searchLabel = $("<label>").html("Search:").css("display", "inline");
	var filterDiv = $("<div>").addClass("dataTables_filter").append(searchLabel).append(name);
	$('.dataTables_wrapper').prepend(filterDiv);

	
	johnny.resetFilter($('.reset'));

	$(".datepickerlazy").datepicker({
		dateFormat: 'yy-mm-dd',
		onSelect: function () {
			updateGrid();
		}
	}).keydown(function (event) {
		if (event.keyCode == 8) { $(".datepickerlazy").val(""); }
		else { event.preventDefault(); }
	});

	$(".filterdata").keyup(function () {
		updateGrid();
	});
 });
function updateGrid() {
	window.clearTimeout(oTime);
	oTime = setTimeout(function () { oTable.fnDraw(); }, 500);
}

var columnHeader = ['title', 'user.name','','pingStatus', 'actives','postDate'];
var QueryData = function (aoData) {
	return johnny.initQueryData(aoData, columnHeader);
}

var DataTableForm = function (json, echo) {
	var dataArray = new Array();
	for (var i = 0; i < json.result.length; i++) {
		var subArray = new Array();
		subArray.push(json.result[i].title);
		subArray.push(json.result[i].user.name);
		var cate = "";
		$(json.result[i].categories).each(function(i,item){
			cate += item.name+",";
		});
		
		subArray.push(cate.substring(0,cate.length-1));
		subArray.push(online(json.result[i].id,json.result[i].pingStatus));
		subArray.push(json.result[i].postDate);
		subArray.push(actionHtml(json.result[i].id,json.result[i].comments - json.result[i].actives));
		dataArray.push(subArray);
	}
	return {
		sEcho: echo,
		iTotalRecords: json.totalCount,
		iTotalDisplayRecords: json.totalCount,
		aaData: dataArray
	};
}

function handler( status,id ){
	console.dir(status);
	var request = ("offline"==status)?'online':'offline';
	$.ajax({
		url : "${ctx}/post/"+id+"/"+request+"/",
		type : "POST",
		dataType : "json",
		success : function(data){		
			if(data && data.state && (data.state.indexOf("ERROR") != -1)){
				johnny.error(data.message);
				return;
			}else{
 				updateGrid();
				johnny.info("create new Group successfully");
				}
		}
	});
	
}
function online(id, status){
	var ss = 'handler(\''+status+'\',\''+id+'\')';
	console.dir(ss);
	var mainSpan = $("<span>");
	var controlDiv = $("<div>").addClass("controls center").appendTo(mainSpan);
	var href = $("<a>").attr({
 		href: "#",
		title:  ('online'==status)? 'offline ':' online',
		onclick : ss
				
		});
//	href.click();
	href.addClass("tip").appendTo(controlDiv);
	var span = $("<span>").text(status);
	if ('online' == status){
		span.addClass("icon12  icomoon-icon-blocked");
	}else{
		span.addClass("icon12 icomoon-icon-play");
	}
 	span.appendTo(href);
  
	return mainSpan.html();
}

function actionHtml(id,number) {
	var mainSpan = $("<span>");
	var controlDiv = $("<div>").addClass("controls center").appendTo(mainSpan);
	var href = $("<a>").attr({
		href: "${ctx}/post/"+id+"/edit/",
		title: "Edit"
	}).addClass("tip").appendTo(controlDiv);
	var span = $("<span>").addClass("icon12 icomoon-icon-pencil").appendTo(href);
	if (number>0){
	var comments = $("<a>").attr({
		href: "${ctx}/post-comment/list/?postId="+id,
		title: "Approve comments"
	}).addClass("tip").appendTo(controlDiv);
	
	var notification =$("<span>").addClass("table-notification").html(number).appendTo(comments);
	}
 	return mainSpan.html();
}
</script>